<style>
	.screen{margin-top: 15px;}
	.goods-info{justify-content: left !important;float: unset !important;}
	.goods-info-name{max-width: 80px;overflow: hidden;cursor: pointer;}
	.change-name{cursor: pointer;}
	.layui-layout-admin .layui-form-item .layui-input-inline{background-color: #fff;}
	.layui-layout-admin .screen{margin-bottom: 15px;}
	.layui-layout-admin .single-filter-box{padding-bottom: 0;}
	.time-lineheight {line-height: 1.3}
</style>

<div class="screen layui-collapse" lay-filter="selection_panel">
	<div class="layui-colla-item">
		<form class="layui-colla-content layui-form layui-show">
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">会员昵称/手机：</label>
					<div class="layui-input-inline">
						<input type="text" name="member_search" placeholder="请输入会员昵称/手机号" class="layui-input">
					</div>
				</div>
                
				<div class="layui-inline">
					<label class="layui-form-label">链动等级：</label>
					<div class="layui-input-inline">
						<select name="level_id" lay-filter="level_id" title="链动等级">
							<option value="">全部</option>
							{foreach $level_list as $level}
							<option value="{$level.level_id}">{$level.level_name}</option>
							{/foreach}
						</select>
					</div>
				</div>
                
                <div class="layui-inline">
					<label class="layui-form-label">奖励类型：</label>
					<div class="layui-input-inline">
						<select name="reward_type" lay-filter="reward_type" title="奖励类型">
							<option value="">全部</option>
							{foreach $reward_type_list as $key => $type_name}
							<option value="{$key}">{$type_name}</option>
							{/foreach}
						</select>
					</div>
				</div>
			</div>

			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">创建时间：</label>
					<div class="layui-input-inline">
						<input type="text" class="layui-input" name="start_time" id="start_time" autocomplete="off" placeholder="开始时间" readonly>
						<i class="iconrili iconfont calendar"></i>
					</div>
					<div class="layui-form-mid">-</div>
					<div class="layui-input-inline">
						<input type="text" class="layui-input" name="end_time" id="end_time" autocomplete="off" placeholder="结束时间" readonly>
						<i class="iconrili iconfont calendar"></i>
					</div>
				</div>

				<div class="layui-inline">
					<label class="layui-form-label">解冻状态：</label>
					<div class="layui-input-inline">
						<select name="thaw_status" lay-filter="thaw_status" title="解冻状态">
							<option value="">全部</option>
                            {foreach $thaw_status_list as $key => $status_name}
							<option value="{$key}">{$status_name}</option>
							{/foreach}
						</select>
					</div>
				</div>
			</div>

			<div class="form-row">
				<button class="layui-btn" lay-submit lay-filter="search">筛选</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</form>
	</div>
</div>

<!-- 列表 -->
<table id="reward_list" lay-filter="reward_list"></table>

<!-- 会员信息 -->
<script type="text/html" id="memberInfo">
	<div class='table-title'>
		<div class='title-pic'>
			<img layer-src src="{{ns.img(d.member_info.headimg)}}" onerror="this.src = '{:img(\'public/static/img/default_img/head.png\')}'" >
		</div>
		<div class='title-content'>
			<p class="layui-elip">{{d.member_info.nickname || '-'}}</p>
			<p class="layui-elip">{{d.member_info.mobile || '-'}}</p>
		</div>
	</div>
</script>

<!-- 链动等级 -->
<script type="text/html" id="levelInfo">
	<span class="layui-badge layui-bg-cyan">{{d.level_info.level_name || '未设置'}}</span>
</script>

<!-- 下单会员信息 -->
<script type="text/html" id="buyMemberInfo">
	<div class='table-title'>
		<div class='title-pic'>
			<img layer-src src="{{ns.img(d.buyMember.headimg)}}" onerror="this.src = '{:img(\'public/static/img/default_img/head.png\')}'" >
		</div>
		<div class='title-content'>
			<p class="layui-elip">{{d.buyMember.nickname || '-'}}</p>
			<p class="layui-elip">订单号：{{(d.lianOrder && d.lianOrder.order_no) || '-'}}</p>	
		</div>
	</div>
</script>

<!-- 奖励类型 -->
<script type="text/html" id="rewardTypeInfo">
	{{# if(d.reward_type == 0){ }}
	<span class="layui-badge layui-bg-blue">直推奖</span>
	{{# }else if(d.reward_type == 1){ }}
	<span class="layui-badge layui-bg-green">见点奖</span>
	{{# }else if(d.reward_type == 2){ }}
	<span class="layui-badge layui-bg-orange">培育奖</span>
	{{# }else if(d.reward_type == 3){ }}
	<span class="layui-badge layui-bg-cyan">平级奖</span>
	{{# }else if(d.reward_type == 4){ }}
	<span class="layui-badge layui-bg-cyan">复购见单奖</span>
	{{# }else if(d.reward_type == 9){ }}
	<span class="layui-badge layui-bg-purple">解冻结算</span>
	{{# } }}
</script>

<!-- 解冻状态 -->
<script type="text/html" id="thawStatusInfo">
	{{# if(d.thaw_status == -1){ }}
	<span class="layui-badge">失效</span>
	{{# }else if(d.thaw_status == 0){ }}
	<span class="layui-badge layui-bg-orange">待解冻</span>
	{{# }else if(d.thaw_status == 1){ }}
	<span class="layui-badge layui-bg-green">已解冻</span>
	{{# }else if(d.thaw_status == 2){ }}
	<span class="layui-badge layui-bg-blue">未冻结</span>
	{{# } }}
</script>

<!-- 发放状态 -->
<script type="text/html" id="statusInfo">
	{{# if(d.status == 1){ }}
	<span class="layui-badge layui-bg-orange">待结算</span>
	{{# }else if(d.status == 2){ }}
	<span class="layui-badge layui-bg-green">已结算</span>
	{{# } }}
</script>

<!-- 工具栏操作 -->
<script type="text/html" id="operation">
	<div class="table-btn">
		<a class="layui-btn" lay-event="detail">详情</a>
	</div>
</script>

<script>
	var table, form, laydate, repeat_flag = false; //防重复标识;
	layui.use(['form', 'laydate'], function() {
		form = layui.form;
		laydate = layui.laydate;
		form.render();

		//渲染时间
		laydate.render({
			elem: '#start_time',
			type: 'datetime'
		});

		laydate.render({
			elem: '#end_time',
			type: 'datetime'
		});

		table = new Table({
			elem: '#reward_list',
			url: ns.url("lian://shop/reward/lists"),
			method: 'post', // 使用POST方法，确保区分页面请求和数据请求
			cols: [
				[{
					field: 'id',
					title: 'ID',
					unresize: 'false',
					width: '5%'
				}, {
					title: '会员信息',
					unresize: 'false',
					width: '12%',
					templet: '#memberInfo'
				}, {
					title: '链动等级',
					unresize: 'false',
					width: '7%',
					templet: '#levelInfo'
				}, {
					title: '下单会员/订单号',
					unresize: 'false',
					width: '18%',
					templet: '#buyMemberInfo'
				}, {
					field: 'settle_amount',
					title: '奖励计算金额',
					unresize: 'false',
					width: '10%',
                    align: 'center'
				}, {
					field: 'give_amount',
					title: '奖励金额',
					unresize: 'false',
					width: '8%',
                    align: 'center'
				}, {
					field: 'frozen_amount',
					title: '冻结金额',
					unresize: 'false',
					width: '8%',
                    align: 'center'
				}, {
					title: '奖励类型',
					unresize: 'false',
					width: '8%',
					templet: '#rewardTypeInfo',
                    align: 'center'
				}, {
					title: '解冻状态',
					unresize: 'false',
					width: '8%',
					templet: '#thawStatusInfo',
                    align: 'center'
				}, {
					title: '状态',
					unresize: 'false',
					width: '8%',
					templet: '#statusInfo',
                    align: 'center'
				},{
					field: 'create_time',
					title: '创建时间',
					unresize: 'false',
					width: '12%',
                    align: 'center',
				}, {
					title: '操作',
					toolbar: '#operation',
					unresize: 'false',
					width: '10%',
                    align: 'center'
				}]
			]
		});

		/**
		 * 搜索功能
		 */
		form.on('submit(search)', function(data) {
			table.reload({
				page: {
					curr: 1
				},
				where: data.field
			});
			return false;
		});

		/**
		 * 监听工具栏操作
		 */
		table.tool(function(obj) {
			var data = obj.data,
				event = obj.event;
			switch (event) {
				case 'detail': // 查看详情
					location.href = ns.url("lian://shop/reward/detail", {"id": data.id});
					break;
			}
		});
	});
    
    // 时间格式化
    function timeFormat(timeStamp) {
        if (timeStamp) {
            var date = new Date();
            date.setTime(timeStamp * 1000);
            var y = date.getFullYear();
            var m = date.getMonth() + 1;
            m = m < 10 ? ('0' + m) : m;
            var d = date.getDate();
            d = d < 10 ? ('0' + d) : d;
            var h = date.getHours();
            h = h < 10 ? ('0' + h) : h;
            var minute = date.getMinutes();
            var second = date.getSeconds();
            minute = minute < 10 ? ('0' + minute) : minute;
            second = second < 10 ? ('0' + second) : second;
            return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
        }
        return '';
    }
</script>
